@import url("https://cdn-font.hyperos.mi.com/font/css?family=MiSans_VF:VF:Chinese_Simplify,Latin&display=swap");
 
 
.HONOR{
	font-family: 'MiSans VF'; 
}
.fw300{
	 font-weight: 300;
}

.fweight{
   font-weight: 500;
}

html,body{ 
	color:#333;
	max-width: 100%;
	overflow-x: hidden;
	font-family:'MiSans VF','Microsoft YaHei','微软雅黑','Arial'!important; 
}
 
 
:root {
  --colorred: #C54B4D;
  --colorblue2:#1889DF;
  --coloryellow: #FB9614;
  --coloryellow2: #F3E734;
}


/**********重置一些原样式**************/

.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1280px;
}
.container-fluid{
	max-width: 1600px;
}

.container-w{
	 width:100%;
	    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 100%;
}

.fixed-top{
    z-index: 999;
}
.pages,.content{
    min-height: 200px; 
}
input:focus,
textarea:focus,
button:focus{
	outline: none; 
}
.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
	margin-bottom: 0;
}
.container {
    padding-right: 10px;
    padding-left: 10px;
}
.clear{
	clear:both;
}
.row{ 
    margin-right: 0px;
    margin-left: 0px;
}
.row0{
	display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	margin-right: -5px;
    margin-left: -5px;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{
	padding-right: 5px;
    padding-left: 5px;
}

.col-md-20{
	-ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.mr-0{
	margin: 0
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link,.nav-pills .nav-link{
	border:none;
}

.nav-link{
	padding:1rem 1rem;
}
.dropdown-menu{
	top:98%;
}
.nav-tabs .nav-link{
	margin-right: 2px;
}

/**********重置一些原结束**************/

/*********自定义一些基本设置**************/
pre{ position: relative; padding:40px 20px 20px; background:#222; color:#f8f8f8; padding-top:50px; border-radius:10px;}
pre::before {
    content: '';
    position: absolute;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #fc625d;
    width: 12px;
    height: 12px;
    top:10px;
    left: 20px;
    -webkit-box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
    box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
    z-index: 2;
}

a:hover{
	color:#000;
}

input:-webkit-autofill {
 box-shadow: 0 0 0 1000px #fff inset;
 -webkit-text-fill-color: #333;
}
.pt-mt-0{
	padding:0!important;
	margin:0!important;
}  

.d-flex-center{
	justify-content:center;    
	align-items:center;
}
.text-center-dflex{
	justify-content:center;   
}


.coloron{
	color:#dbbc87!important;
}
.colora6{
	color:#A6A6A6!important;
}
.color000{
	color:#000!important;
}
.colorccc{
	color:#fff!important;
}


.colorfff{
	color:#fff!important;
}

.color666{
	color:#6f6f6f!important;
}
.colorddd{
	color:#ddd!important;
}
.colorccc{
	color:#ccc!important;
}

.color888{
	color:#888!important;
}
.color333{
	color:#333!important;
}
.color39{
	color:#393939!important;
}

.color2a{
	color:#2a2a2a!important;
}
.coloron{
	color:#dbbc87!important;
}

.colorred{
	 color:#C2000B;
}
.bg000 {
	background: #000;
}
.bgeb{
	background: #EBEBEB;
}
.bg1f{
	background: #1F1F1F;
}
.bg15{
	background: #151515;
}
.bgf8{
	background: #f8f8f8;
}
.bgf7{
	background: #f7f7f7;
}
.bg111{
	background: #111;
}

.bgblue{
	background: #EDF0FA!important;
} 
.bgblue2{
	background: #F7F8FD!important;
}

.bg0{
	background: #000!important;
}

.bgddd{
	background: #ddd!important;
}

.bgfff{
	background: #fff!important;
}
.bgf5{
	background: #f5f5f5!important;
}

.bg39{
	background: #393939!important;
}
.bg44{
	background: #444444!important;
}
.bg16{
	background: #161616!important;
}

.fs-13{
	font-size: 13px;
}

.fa-square:before,
.fa-circle:before,
.fa-check-square:before{
	margin-right: 3px;
}

.title-bg{
	color:var(--colorred);
    display: inline-block; 
}

.leftmenus .onemenu .leftmenus-link{   
    display: block;
    }
.leftmenus .twomenu a{
      font-size: 13px;
      padding-left: 15px;
}


.navbar-light .navbar-toggler{
	border: none;
}

.fill{
	object-fit:fill;
}
.contain{
	object-fit:contain;
}
.cover{
	object-fit:cover;
}
.none{
	object-fit:none;
}
.scale-down {
	object-fit:scale-down;
}

.fs-50{
	font-size:50px;
}

/**********自定义一些基本设置结束**************/



/*********导航部分**************/
.top{
	height:26px;
	line-height: 26px;
}

.logo-sm-height{
	height: 80px;
	padding:15px 0;
}

.head-sm-height{
	height: 100px;
}
.navbar{
	padding:0px 1rem;
}
.navbar-light .navbar-nav .nav-link{
	color:#191919;
	padding:0 30px; 
	height: 75px;
	line-height: 75px;
	font-size: 18px;
}

.navbar-expand-lg .navbar-nav .dropdown-menu{
	position: fixed;
	top:100px;
	left:0;
	width:100%; 
	background: rgba(0,0,0,0);
	z-index: 999;
	padding:0;
	border:none;
}

.second-menu-box{
	 background: #fff;
	 border-radius: 0 0 15px 15px;
	 border:1px solid #ddd;
	 border-top:none;
	 padding:40px 50px;
	 box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);

}
.second-menu-box .title-one,
.second-menu-box .title-one i{
	transition: all 0.6s;
	cursor: pointer;
}
.second-menu-box .title-one:hover i{
	margin-left: 5px;
}

.second-link{
	-ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
    padding:20px;
    cursor: pointer;
    border-radius: 15px;
}

.second-link:hover{
	background: #fff;
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;	
}

.register{
	display: inline-block;
	background: #c7000b;
	padding:5px 16px;
	border-radius: 30px;
	color:#fff!important;
}
.register:hover{
	background: #d64a52;
}

.top-weixin{
	position: relative;
}
.top-weixin .weixin{
	position: absolute;
	left:-70px;
	width:140px;
	padding:10px;
	top:40px;
	display: none;
}
.top-weixin:hover .weixin{
	display: block;
}



/********banner************/
.more-white{
	padding:13px 40px;
	border:1px solid #fff;
	display: inline-block!important;
	border-radius: 30px!important;
	color:#fff;
}
.more-white:hover{
	background: #fff;
	color:#333!important;
}

.more{
	padding:13px 40px;
	border:1px solid #333;
	display: inline-block!important;
	border-radius: 30px!important;
	 
}
.more:hover{
	 background: #333;
	 color:#fff;
}

.more-btn{
	padding:6px 40px;
	border:1px solid #fff;
	display: inline-block!important;
	border-radius: 30px!important;
	color:#fff;
}





.index-server{
	 padding:30px 15px;
	 background: #fff;
	 border-radius: 15px;
	 transition: all 0.6s;
	 color:#333;
}

.index-server .pic img{
	 width:100px;
}
.index-server:hover{
	 cursor: pointer;
	 background: var(--colorred);
	 color:#fff;
}

/*********优势 *************/

.advantage{
	padding:30px 10px;
	text-align: center;
	cursor: pointer;
}

.advantage .title{
	font-size: 18px;
	font-weight: bold;
}

.advantage .desc{
	font-size: 14px;
	margin-top: 10px;
	color:#666;
}
.advantage:hover{
	background: #fff;
}


/********首页案例*************/

.index-productlist{
	background-color:#fff;
	width:100%;
	position:relative;
	display:inline-block;
	border-radius: 15px 15px 0 0;
	overflow:hidden;	

}

.index-product-img-box{
	margin-top:62.5%;
}

 .index-pro-box{
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	width:100%;
	height:100%; 
}

.index-pro-box-content{
	position:relative;
	width:100%;
	height:100%;
}

.index-pro-box-content img {
	width:100%;
	height:100%;
}
 

.index-pro-title-box{
   background: #fff;
   border-radius: 0 0 15px 15px;
   padding:15px;
   margin-top: -5px;	 
} 	

.index-pro-title-box .title{
	height: 24px;
	overflow-y: hidden;

	margin-top: -5px;
}
        
.nav-tabs{
	border:none;
	display: block;
	text-align: center;

}
.nav-tabs .nav-item.show .nav-link-tab, 
.nav-tabs .nav-link-tab.active{
	border:none!important;
	background: none;
	color:#000;
	border-bottom: 2px solid #000!important;
	font-weight: bold;
}
.nav-tabs .nav-link-tab{
	display: inline-block!important;
	cursor: pointer;
    font-size: 18px;
    line-height: 28px;
    margin: 0 20px;
    padding:0;
    padding-bottom: 10px;
    position: relative;
    -webkit-transition: .2s;
    transition: .2s;
    background: none;

}

.nav-tabs .nav-link-tab:hover{
	border:none;
}







.modelist2 .card{
	background: rgba(0,0,0,0);
	border:none;
	height:170px;
	overflow:hidden;
	margin: 8px 0;
}
.modelist2{
	height: 270px;
	padding-right: 12px;
	padding-left: 12px;
	padding-top: 5px;	
	background: url(../images/pc2.png);
	background-size: 100% 100%;
}


/********降本增效*************/

.reduction{
	background-color:#fff;
	width:100%;
	position:relative;
	display:inline-block;
	border-radius: 15px; 
}

.reduction-big-box{
	 margin-top:80%;
}

.reduction-box{
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	width:100%;
	height:100%; 
	display: flex;
	align-items: center;
	text-align: center;
}

.reduction-box img{
	 width:70px;
}




/*****-----释放数字生产力--*********/

.productivity{
	margin-top: 30px;
	position: relative;
}
.swiper-slide-productivity{
	width:1140px;
}
.swiper-slide-productivity a{
	transition: 0.2s;
	position: relative;
	display: block;
	border-radius: 25px;
	overflow:hidden;
}	
 
.swiper-slide-productivity a .desc{
	 position: absolute;
	 left:0;
	 top:0px;
	 z-index: 99;
	 padding:0px 50px;
	 
}

.swiper-pagination-productivity{
	text-align:center;
	width:100%;
	margin-top:10px; 	
	margin-top: 50px;
	position: relative;
}

.swiper-pagination-productivity .swiper-pagination-bullet {
    width: auto;
    display: inline-block;
    margin:0 15px;
    padding-bottom: 10px;
    height: auto; 
	background: none;
	font-size: 18px;	
	opacity: 0.8;
	border-radius: 0;
}
.swiper-pagination-productivity   .swiper-pagination-bullet-active{
	 border-bottom: 3px solid #000;
	 font-weight: bold;
}
.swiper-button-prev-productivity{
	width:50%;
	height:520px;
	left:-520px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
 }	
.swiper-button-prev-productivity:before{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    left: 84%;
    top: 50%;
    margin-top: -260px;
}
.swiper-button-next-productivity{
	width:50%;
	height:520px;
	right:-520px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
	}
.swiper-button-next-productivity:after{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    right: 84%;
    top: 50%;
    margin-top: -260px;
	transform: rotate(180deg);
}
.swiper-button-prev-productivity:hover,.swiper-button-next-productivity:hover{
	opacity:0.6;
}

.swiper-slide-productivity a   .desc{
	display: none;
}
.swiper-slide-active a .desc{
	width:100%;
	height: 100%;
	background:rgb(0,0,0,0.3);
	display: flex;
	align-items: center;	
	color:#fff; 
}
.swiper-slide-productivity a .desc .txt{
	 width:60%;
	 display: block;
}


.swiper-slide-active:hover{
	 opacity: 1;
}
.swiper-slide-active:hover  a .desc{
   color:#000;
}
.swiper-slide-active:hover a .desc{	 
	background:rgb(255,255,255,0.3);
	 
}
.swiper-slide-active:hover a .desc .more-btn{
	 border-color:#333;
	 background: #333;
}



/*******合作  cooperate*****************/

.cooperate{
	 margin-top: 100px;
}

.left-txt{
	 display: flex;
	 align-items: center;
}

.parter-list{
	 height:auto;
	 border-radius: 20px;
	 background: #fff;
	 padding:32px;
}

.parter-list .ico img{
	width:48px;
	height: 48px;
	margin-bottom: 20px;
}



.parter-list{
    overflow: hidden;
    position: relative;
    z-index: 1;
        
    }
    .parter-list::before {
    content: '';
    position: absolute;
    background: #6153fc;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: -1;
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: transform .4s ease-out;
}

.parter-list:hover::before {
    transform-origin: center top;
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
}

.parter-list:hover,.parter-list:hover .title,.parter-list:hover .subtitle{
    color:#FFF;
}
.parter-list:hover .ico .white-image{
   filter: grayscale(100%) brightness(2000%);
}






/****---全球300万客户的共同选择*************/
#custom{
	 position: relative;
}
.custom-txt{
    position:absolute;
    top:80px;
    left:0;
    width:100%;
    z-index: 99;
    text-align: center;
}
.custom-txt .title{

}
.custom-txt .swiper-pagination-custom .swiper-pagination-bullet{
	 width: auto;
	 height: auto;
	 display: inline-block;
	 margin: 0 20px;
	 background: rgba(0,0,0,0);
	 border-radius: 0;
	 color:#fff;
	 font-size: 18px;
	 opacity: 1;
	 padding-bottom: 10px;
}

.custom-txt .swiper-pagination-custom .swiper-pagination-bullet-active{
	 font-weight: bold;
	 border-bottom: 2px solid #fff;
}


/****外贸网站建设，让业务全球可达*************/

.index-en{
	 display: flex;
	 align-items: center;
}

.index-num{
	 margin-top: 100px;
}

.index-parter{
	 background: #fff;
	 border-radius: 15px;
	 padding:40px 70px;
	 width:100%;	 
}

.index-parter .list-box{
	background: #fff;
    border: 1px solid #e1e1e1;
    height: 100px;
    padding: 0 40px;
    line-height: 100px;
}

/************FOOT********************/

.footer{
	 background: #f3f3f3;
}

.footer-service{
	 background: #f3f3f3;
	 padding:30px 0;
}

.footer-service-list{
	-ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
    display: flex;
}
.footer-service-list .ico{
	width:60px;
	margin-right: 10px;
}

.footer-service-list .right-txt{
	width:calc(100% - 70px);
	padding-top: 10px;
}
.footer-service-list .right-txt .title{
	font-size: 17px;
}


.footlogo{
	height: 40px;
}



.foot-top{
	background: url(../images/bgfoottop.jpg);
	padding:50px 0;
	background-size: 100% 100%;
}

/*********侧边栏*********************/

 .online {
	width:40px;
	right:2px;
}
.online dl {
	background:rgba(0,0,0,0);
	width:40px;
	height:auto;
	color:#333;
	margin-bottom:-1px;
	border:none;
	border-radius: 0;

	text-align:center;
}

.online dl:hover {
	background:rgba(0,0,0,0);
	border:none;
	cursor: pointer;
}






/************新闻列表1**********************/

.newslist{
	background: #fff;
}

.newslist .ico{
	height: 200px;
	overflow-y: hidden;
	border-bottom: 1px solid #ddd;
}

.newslist .txt{
	background: #fff;
	padding:24px 24px 34px 24px;
}

.newslist .txt .title{
	 height: 48px;
	 font-size: 18px;
	 font-weight: bold;
	 line-height: 24px;
	 margin-bottom: 10px;
}

.newslist .txt .desc{
	line-height: 24px;
	height: 72px;
	overflow-y: hidden;
}


/************新闻列表2**********************/

.newslist2{ 
	border-bottom: 1px solid #ddd;
	display: flex;
	padding: 20px 0;
}

.newslist2 .date{
	width:180px;
	display: flex;
	text-align: center;
	border-right: 1px solid #ddd;
	margin-right: 50px;
}
.newslist2 .date .d{
	font-size: 40px;
}

.newslist2 .date .ym{
	padding-top: 5px;
	font-size: 16px;
	margin-left: 10px;
}

.newslist .list-txt{
	width: calc(100% - 230px)
}



.newslist-xcx img{
	border:1px solid #ddd;
}


/************新闻详情**********************/

.news-info{
	 background: #fff;
	 border:1px solid #ddd;
	 box-shadow: 2px 2px 10px 10px #eee;
	 margin: 50px 0;
	 padding:15px;
}


/************二级菜单**********************/

.sonsort-box{
	border-top: 1px solid #ddd;
	background: #fff;
}
.sonsort{
	padding:15px 0;
}
.sonsort-menu{
	margin:0 15px;
	font-size: 14px;
	padding:15px 0;
}
.sonsort-menu-on{
	font-weight: bold;
	border-bottom: 3px solid #000;
}


/**********分页**********************/

.page-num, .page-link{
	color:#333;
}

.page-num-current { 
    background-color: #333;
    border-color: #333;
    color:#fff;
}



.jumbotron-fluid{
	 height: 300px;
	 background: url(../images/banner.jpg);
	 background-size: cover;
}


/*********联系********************/

.contact-btn{
	 padding:10px 30px;
	 background: #C2000B;
	 color:#fff;
	 display: inline-block;
}
.contact-btn:hover{
	 color:#fff;
	 background:#9A0009;
}
.contact-box{
	background: #fff;
	box-shadow: 2px 2px 10px 10px #eee;
	padding:40px;
}

.book-btn{
	border:1px solid #C2000B;
	padding:10px 30px;
	display: inline-block;
}

.book-btn:hover{
	background: #c2000b;
	color:#fff;
}



/*******服务流程***********/

.serverlist{
	 background: #F1F1F1;
	 display: flex;
}
.serverlist .box1{
	-ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    display: flex;
    align-items: center;
    padding:0 50px;
}
.serverlist .box2{
	-ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}


/***********网站建设******************/

.web-list{

}

.web-list-box{
	padding:20px;
}

.web-list-box .desc{
	height: 48px;
	line-height: 24px;
	overflow-y: hidden;
}



.custom{
	display: flex;
}

.custom .ico{
	width:70px;
	margin-right: 10px;
}

.custom .ico img{
	width:60px;
}

.custom .txt{
	width:calc(100% - 80px);
}



.ecs{
	background: #fff;
	border-radius: 15px;
	display: flex;
	height: 150px;
	align-items: center;
}

.ecs .ecs-box{
	display: block;
	width: 100%;
}

.ecs .ecs-box .ico{
	 width:100%;
}

.ecs .ecs-box .ico img{
	width: 150px;
}


/********留言*********************/

.form-group{
	margin-bottom: 15px;
	float: left;
	display: block;
	width:100%;
}
.input0{
	margin-bottom: 10px;
	font-weight: bold;
	
}

.form-control{
	height: 40px;
}

.disabled-btn{
   background: #f8f8f8!important;
   pointer-events: none;
   cursor: not-allowed; 
}


/*******seo*****************/

.seo{
	height: 160px;
	background: #fff;
	padding:30px; 
	box-shadow: 4px 4px 10px 4px #ddd;
	cursor: pointer;
	color:#333;
}
 

.seo:hover{
	background: url(../images/titilebg.jpg);
	background-size: cover;
	color:#fff;
}


/******平面设计***************/

.brand-list{
	border:1px solid #ddd;
 }

 .brand-list  .txt{
 	padding:30px;
 }

.brand-list .txt .title{
	 font-size: 30px;
    font-weight: normal;
    line-height: 60px;
    color: #221815;
    margin-bottom: 16px
}

.brand-list .txt .desc{
	font-size: 16px;
    line-height: 30px;
    color: #000; 
}



/*****APP***************/

.App {
	width:100%;
	height:auto;
	margin-top:63px;
	padding-bottom:70px;
}
.App_con {
	width:100%;
	height:auto;
	margin-top:40px;
}
.App_con li {
	width:48%;
	height:380px;
	float:left;
	position:relative;
	transition:all 0.3s cubic-bezier(0.4,0,0.2,1),z-index 0s 0.12s;
	border:1px solid #e5e5e5;
	box-sizing:border-box;
	margin:1%;
	margin-bottom:20px;
	cursor:pointer;
}
.App_con li a {
	display:block;
	width:100%;
	height:100%;
	overflow:hidden;
	transition:none;
}
.App_con li:last-child {
	margin-right:0;
}
.App_top {
	width:100%;
	height:155px;
	background:#FB970B;
	padding-top:45px;
	font-size:24px;
	color:#fff;
	text-align:center;
	box-sizing:border-box;
}
.App_con li:nth-child(2) .App_top{
	background:#019BF1;
}
.App_con li:nth-child(3) .App_top{
	background:#8C00CE;
}
.App_con li:nth-child(4) .App_top{
	background:#BF0025;
}


.App_c {
	width:100%;
	height:auto;
}
.App_pic {
	width:100%;
	height:auto;
	text-align:center;
	margin-top:-45px;
}
.App_list {
	width:100%;
	height:auto;
	padding:0 20px;
	overflow:hidden;
	box-sizing:border-box;
	transition:all 0.12s cubic-bezier(0.4,0,0.2,1) 0s;
	position:absolute;
	z-index:3;
	opacity:1;
	left:0;
	top:220px;
}
.App_list span {
	display:block;
	background:url(../images/icon29.png) no-repeat left center;
	padding-left:10px;
	font-size:14px;
	color:#666666;
	margin-right:25px;
	float:left;
	line-height:20px;
	margin-bottom:5px;
}
.App_list span:nth-child(3n) {
	margin-right:0;
}
.App_detail {
	width:100%;
	height:auto;
	padding:0 28px;
	text-align:center;
	margin-top:30px;
	box-sizing:border-box;
	opacity:0;
	z-index:0;
	position:absolute;
	left:0;
	transition:all 0.12s cubic-bezier(0.4,0,0.2,1) 0s;
}
.App_detail p {
	font-size:14px;
	color:#666666;
	line-height:24px;
	overflow:hidden;
	text-overflow:ellipsis;
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	height:72px;
}
.App_detail span {
	display:block;
	width:105px;
	height:30px;
	line-height:30px;
	text-align:center;
	color:#fff;
	border-radius:15px;
	background:#FB970B;
	font-size:14px;
	margin:0 auto;
	margin-top:20px;
}
.App_con li:hover {
	box-shadow:0px 5px 24px #FB970B;
	border:1px solid #fe496b;
}
.App_con li:hover .App_list {
	opacity:0;
	z-index:1;
}
.App_con li:hover .App_detail {
	opacity:1;
	z-index:3;
}